<div>
    <div class="panel panel-default">
        <div class="panel-heading">基本</div>
        <div class="panel-body">
            <div class="text-center">
                <basic-charts></basic-charts>
            </div>

            <tabset>
                <tab heading="html">
                    <pre class="prettyprint linenums lang-html">{{basicHtml}}</pre>
                </tab>
                <tab heading="TypeScript">
                    <pre class="prettyprint linenums lang-js">{{basicTs}}</pre>
                </tab>
            </tabset>
        </div>
    </div>
</div>

<div>
    <div class="panel panel-default">
        <div class="panel-heading">属性(Attributes)</div>
        <div class="panel-body">
            <div class="text-center">
                <setting-charts></setting-charts>
            </div>

            <tabset>
                <tab heading="html">
                    <pre class="prettyprint linenums lang-html">{{settingHtml}}</pre>
                </tab>
                <tab heading="TypeScript">
                    <pre class="prettyprint linenums lang-js">{{settingTs}}</pre>
                </tab>
            </tabset>
        </div>
    </div>
</div>

<div>
    <div class="panel panel-default">
        <div class="panel-heading">事件(Events)</div>
        <div class="panel-body">
            <div class="text-center">
                <event-charts></event-charts>
            </div>

            <tabset>
                <tab heading="html">
                    <pre class="prettyprint linenums lang-html">{{eventHtml}}</pre>
                </tab>
                <tab heading="TypeScript">
                    <pre class="prettyprint linenums lang-js">{{eventTs}}</pre>
                </tab>
            </tabset>
        </div>
    </div>
</div>

<div>
    <div class="panel panel-default">
        <div class="panel-heading">方法(Methods)</div>
        <div class="panel-body">
            <div class="text-center">
                <method-charts></method-charts>
            </div>

            <tabset>
                <tab heading="html">
                    <pre class="prettyprint linenums lang-html">{{methodHtml}}</pre>
                </tab>
                <tab heading="TypeScript">
                    <pre class="prettyprint linenums lang-js">{{methodTs}}</pre>
                </tab>
            </tabset>
        </div>
    </div>
</div>

<div>
    <div class="panel panel-default">
        <div class="panel-heading">日历图-新</div>
        <div class="panel-body">
            <div class="text-center">
                <calendar-charts></calendar-charts>
            </div>

            <tabset>
                <tab heading="html">
                    <pre class="prettyprint linenums lang-html">{{calendarHtml}}</pre>
                </tab>
                <tab heading="TypeScript">
                    <pre class="prettyprint linenums lang-js">{{calendarTs}}</pre>
                </tab>
            </tabset>
        </div>
    </div>
</div>